@extends('default.layouts.adminPublic')
@section('title', '网站内容发布')
@section('headcss')
    @parent
    <link rel="stylesheet" href="{{asset('/default/css/admin/jobFair.css')}}">
    <link rel="stylesheet" type="text/css" href="{{asset('/vendor/webuploader/dist/webuploader_img.css')}}">
    @endsection
    @section('content')
            <!--导航开始-->
    <div class="crumb_warp">
        <i class="fa fa-home"></i> <a href="{{url('admin')}}">首页</a> &raquo; 网站内容
    </div>
    <!--导航结束-->
    <!--列表开始-->

    <div class="result_wrap">
        <div class="result_title">
            <h3>内容列表 <em class="red">{{ session("message") }}</em></h3>
            @include('flash::message')
        </div>
        <!--快捷导航 开始-->
        <div class="result_content">
            <div class="short_wrap">
                <a href="{{ url('admin/webcontent/') }}"><i class="fa fa-mail-reply"></i>网站管理页面</a>
                <a href="{{ url('admin/webcontent/create') }}"><i class="fa fa-plus"></i>添加网站内容</a>
            </div>
        </div>
        <div class="con">
            <div class="conMain">
                <div class="manage" style="padding: 0; margin-bottom: 10px;">
                    @if(count($errors)>0)
                        <div class="mark">
                            @if(is_object($errors))
                                @foreach($errors->all() as $error)
                                    <p>{{$error}}</p>
                                @endforeach
                            @else
                                <p>{{$errors}}</p>
                            @endif
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
    <!--快捷导航 结束-->
    <form action="{{ url('/admin/webcontent') }}" method="post" onsubmit="return checkForm('#webContentForm')"
          name="webContentForm" id="webContentForm">
        <div class="result_wrap border_buttom">
            {{csrf_field()}}
            <ul class="list_tab make">
                <li class="create-li">
                    <span class="left">内容标题：</span>
                    <span class="right"><input type="text" style="width:400px;" name="title" id="title"
                                               value="{{ old('title') }}"></span>
                </li>
                <li class="create-li">
                    <span class="left">内容标签：</span>
                    <span class="right"><input type="text" name="sign" id="sign"
                                               value="{{ old('sign') }}"></span>
                </li>
                <li class="create-li">
                    <span class="left">内容排序：</span>
                    <span class="right"><input type="text" style="width:200px;" name="descid" id="descid"
                                               value="{{ old('descid') }}"></span>
                </li>
            </ul>
            <div class="attend" id="uploader" style="height:120px;">
                <div class="left" style="height:120px; line-height:120px;">背景图片：</div>
                <div class="rcontent" style="height:120px;"> <!--用来存放item-->
                    <div id="fileList"></div>
                    <div id="filePicker" class="pick">背景图片</div>
                    <div class="bgimg" id="bgimg"></div>
                    <input type="hidden" id="imgUrl" name="img"></div>
            </div>
            <div class="bbs">
                <div class="title">内容 <em>{{ $errors->first('editorvalue') }}</em></div>
            </div>
            <div class="bbs">
                <script id="editor" type="text/plain"
                        style="width:100%;min-height:250px;line-height:20px;">{!! old('editorvalue') !!}</script>
            </div>
            <div class="news-submit">
                <div class="submit-right">
                    <div class="submit-left"><input type="hidden" name="img_tag" id="img_tag" value="{{ $strRandom or '' }}"></div>
                    <input type="submit" value="提 交">
                    <input type="button" class="back" onclick="history.go(-1)" value="返回">
                </div>
            </div>
        </div>
    </form>
@endsection

@section('footerjs')
    @parent
    <script>
        var UPLOADER_URL = '{{url('/')}}';
        var uplod_url = "/admin/web_upload_url?img_tag={{ $strRandom }}";
    </script>
    <script type="text/javascript" charset="utf-8" src="{{asset('/vendor/ueditor/ueditor.config.js')}}"></script>
    <script type="text/javascript" charset="utf-8" src="{{asset('/vendor/ueditor/ueditor.all.min.js')}}"></script>
    <script type="text/javascript" charset="utf-8" src="{{asset('/vendor/ueditor/lang/zh-cn/zh-cn.js')}}"></script>
    <script type="text/javascript">
        var ue = UE.getEditor('editor', {
            textarea: 'editorvalue'
        });
        ue.ready(function(){
            ue.execCommand('serverparam', '_token', '{{ csrf_token() }}');
        });
    </script>
    <script type="text/javascript" src="{{asset('/vendor/webuploader/dist/webuploader.min.js')}}"></script>
    <script type="text/javascript">
        var BASE_URL = '{{url('/')}}/';
        uploaderWeb("#filePicker");
        var uploader;
        //上传图片
        function uploaderWeb(pick){
            uploader = WebUploader.create({
                auto: true,
                formData: {
                    _token: "{{csrf_token()}}",
                    img_tag: $('#webContentForm').find("#img_tag").val()
                },
                multiple: false,  //开启多个文件上传
                // swf文件路径
                swf: BASE_URL + 'public/vendor/webuploader/dist/Uploader.swf',
                // 文件接收服务端。
                server: "{{ route("WebContent.bgImgUpload") }}",
                // 选择文件的按钮。可选。
                // 内部根据当前运行是创建，可能是input元素，也可能是flash.
                //pick : "#filePicker",
                pick: {
                    id: pick,
                    name: "file", //这个地方 name 没什么用，虽然打开调试器，input的名字确实改过来了。但是提交到后台取不到文件。如果想自定义file的name属性，还是要和fileVal 配合使用。
                    //label: '点击选择图片',
                    multiple: false //默认为true，就是可以多选
                },
                compress: false,
                fileNumLimit: 1,
                accept: {
                    title: 'Images',
                    extensions: 'gif,jpg,jpeg,bmp,png',
                    mimeTypes: '.gif,.jpg,.jpeg,.bmp,.png'
                },
                // 不压缩image, 默认如果是jpeg，文件上传前会压缩一把再上传！
                fileSingleSizeLimit: 2000 * 1024
            });
            //上传文件出错时
            uploader.on('error', function(file){
                if(file == 'F_EXCEED_SIZE'){
                    layer.msg('文件大小大小不能超过2M！');
                }
                if(file == 'F_DUPLICATE'){
                    layer.msg('此文件已经存在队列当中，不能重复上传！');
                }
                if(file == 'Q_EXCEED_NUM_LIMIT'){
                    layer.msg('你已经上传了背景文件！');
                }
                if(file == 'Q_TYPE_DENIED'){
                    layer.msg('文件类型不匹配，请重新上传！');
                }
            });
            // 当有文件被添加进队列的时候
            uploader.on('fileQueued', function(file){
                var str = '';
                str += '<div id="' + file.id + '" class="item">';
                str += '<i class="imgIcon"></i>';
                str += '<span class="imgInfo">' + file.name + '</span>';
                str += '<i class="delIcon"></i>';
                str += '</div>';
                $("#webContentForm").find("#uploader").find('#fileList').prepend(str);
                $("#webContentForm").find("#bgimg").append('<img src="" class="upimg">');
                //删除上传文件
                $("#webContentForm").find("#uploader").find('#fileList').find("#" + file.id).on('click', '.delIcon', function(){
                    $("#webContentForm").find("#uploader").find('#fileList').find("#" + file.id).remove();
                    uploader.removeFile(file.id, true);
                    $("#webContentForm").find("#bgimg").find('img').remove();
                    $("#webContentForm").find("#imgUrl").val('');
                });
            });
            uploader.on('uploadSuccess', function(file, response){
                if(response.status == 200){
                    $("#imgUrl").val(response.url);
                    $("#bgimg").find('img').attr('src',response.imgurl);
                }else{
                    layer.msg(response.info);
                }
            });
        }

    </script>
@endsection